body {
  font-size: 16px;
  /* Establece un tamaño de fuente base */
  transition: font-size 0.2s;
  /* Añade una transición para suavizar los cambios */
}

/* Estilos adicionales para el modo oscuro */
/* Estilos para el modo claro */
body {
  background-color: #ffffff;
  color: #000000;
}

.card {
  background-color: #ffffff;
  color: #000000;
}

/* Estilos para el modo oscuro */
body.dark-mode {
  background-color: #1a1a1a;
  color: #ffffff;
}

body.dark-mode .card {
  background-color: #1a1a1a;
  color: #ffffff;
}

/* Estilos para el modo de color Primary */
.bg-primary {
  background-color: #007bff;
  color: #ffffff;
}

/* Estilos para el modo de color Secondary */
.bg-secondary {
  background-color: #6c757d;
  color: #ffffff;
}



/* Estilo para los enlaces en el modo oscuro */
body.dark-mode a {
  color: #6c757d;
  /* Gris */
}

/* Estilo para el modo cromático */
body.cromatico {
  background-color: #6c757d;
  color: #f8f9fa;
}

body.cromatico .card {
  background-color: #6c757d;
  color: #f8f9fa;
}

body.cromatico a {
  color: #f8f9fa;
}